<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>慕课系统 - 注册</title>
    <meta name="description" content="慕课系统">

    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/style.css" th:href="@{/css/style.css}" rel="stylesheet"/>
    <link href="../static/css/login.min.css" th:href="@{/css/login.min.css}" rel="stylesheet"/>
    <link href="../static/ruoyi/css/ry-ui.css" th:href="@{/ruoyi/css/ry-ui.css?v=4.6.0}" rel="stylesheet"/>
    <!-- 360浏览器急速模式 -->
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="shortcut icon" href="../static/favicon.ico" th:href="@{favicon.ico}"/>
    <style type="text/css">label.error { position:inherit;  }</style>

</head>

<body class="gray-bg">

    <div class="middle-box text-center loginscreen  animated fadeInDown">
        <div>
            <div>


            </div>
            <h3>欢迎注册</h3>
            <p>创建一个新账户</p>
            <form class="m-t"  id="registerForm" autocomplete="off">
                <div class="form-group">
                    <input type="text" name="username" class="form-control" placeholder="请输入用户名" maxlength="20" required="">
                </div>
                <div class="form-group">
                    <input type="password" name="password" class="form-control" placeholder="请输入密码" maxlength="20" required="">
                </div>
                <div class="form-group">
                    <input type="password"  name="confirmPassword" class="form-control" placeholder="请再次输入密码" maxlength="20" required="">
                </div>

                <div class="form-group" th:if="${captchaEnabled==true}" >
                    <div class="col-xs-6" style="padding: 0 0 0 0">
                        <input type="text" name="validateCode" class="form-control code"  placeholder="验证码" maxlength="5" />
                    </div>
                    <div class="col-xs-6">
                        <a href="javascript:void(0);" title="点击更换验证码">
                            <img th:src="@{captcha/captchaImage(type=${captchaType})}" style="margin-bottom: 10px" class="imgcode" width="85%"/>
                        </a>
                    </div>
                </div>

                <div class="form-group text-left" th:classappend="${captchaEnabled==false} ? 'm-t'">
                    <input type="checkbox" id="acceptTerm" name="acceptTerm"> <label for="acceptTerm">我已阅读并同意</label>
                </div>
                <button class="btn btn-primary block full-width m-b"  id="btnSubmit" data-loading="正在验证注册，请稍后...">注 册</button>

                <p class="text-muted text-center"><small>已经有账户了？</small><a th:href="@{login}">点此登录</a>
                </p>

            </form>
        </div>
    </div>

    <script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; </script>
    <!-- 全局js -->
    <script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
    <script src="../static/js/bootstrap.min.js" th:src="@{/js/bootstrap.min.js}"></script>
    <!-- 验证插件 -->
    <script src="../static/ajax/libs/validate/jquery.validate.min.js" th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>
    <script src="../static/ajax/libs/validate/messages_zh.min.js" th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script>
    <script src="../static/ajax/libs/layer/layer.min.js" th:src="@{/ajax/libs/layer/layer.min.js}"></script>
    <script src="../static/ajax/libs/blockUI/jquery.blockUI.js" th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script>
    <script src="../static/ruoyi/js/ry-ui.js" th:src="@{/ruoyi/js/ry-ui.js?v=4.6.0}"></script>
    <script src="../static/ruoyi/register.js" th:src="@{/ruoyi/register.js}"></script>
    <script src="../static/ajax/libs/iCheck/icheck.min.js" th:src="@{/ajax/libs/iCheck/icheck.min.js}"></script>
    <script>
        $(document).ready(function () {
            $('.i-checks').iCheck({
                checkboxClass: 'icheckbox_square-green',
                radioClass: 'iradio_square-green',
            });
        });
    </script>

</body>

</html>
